import React, { createContext, Dispatch, useState, useReducer, useEffect } from "react"

const DialogStackItem = {
    dialogFlag: {},
    dialogProps: {}
}

const Action = {
    type: 'close' | 'back'
} | {
    type: 'open' | 'replace',
    dialogFlag: "",
    dialogProps: {}
}

const dialogReducer = (dialogStack, action) => {

    console.log("什么呢 收到消息了吗 type", " action ", action)
    switch (action.type) {
        case 'close':
            return []
        case 'open':
            return [
                ...dialogStack,
                {
                    dialogFlag: action.dialogFlag,
                    dialogProps: action.dialogProps
                }
            ]
        case 'replace':
            return [
                {
                    dialogFlag: action.dialogFlag,
                    dialogProps: action.dialogProps
                }
            ]
        case 'back':
            return dialogStack.slice(0, dialogStack.length - 1)
        default:
            return dialogStack
    }
}

const initDialogState = []

const useDialog = () => {
    const [dialogStack, dispatch] = useReducer(dialogReducer, initDialogState)
    console.log("什么呢 收到消息了吗", " dispatch ", dispatch)
    useEffect(() => {
        document.body.style.cssText = dialogStack.length ? 'overflow: hidden;' : ''
    }, [dialogStack.length])

    return {
        dialogStack,
        dispatch
    }
}

export default useDialog